<template>
  <div class="app-container">
    <header>
      <el-form :inline="true" :model="searchFrom" class="demo-form-inline">
        <el-form-item label="编号">
          <el-input
            v-model="searchFrom.code"
            placeholder="请输入编号"
          ></el-input>
        </el-form-item>
        <el-form-item label="状态">
          <el-select v-model="searchFrom.status" placeholder="请选择">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">查询</el-button>
        </el-form-item>
      </el-form>
    </header>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="id" label="序号" width="80"> </el-table-column>
      <el-table-column prop="code" label="编号" width="80"> </el-table-column>
      <el-table-column prop="name" label="名称" width="180"> </el-table-column>
      <el-table-column prop="employeeName" label="提交者" width="180">
      </el-table-column>

      <el-table-column prop="approveName" label="审核者" width="180">
      </el-table-column>
      <el-table-column prop="status" label="审核状态" width="80">
        <template slot-scope="scope">
          <!-- {{ scope.row.status == 2 }} -->
          <span v-show="scope.row.status == 0">
            <el-tag type="info">待审核</el-tag>
          </span>
          <span v-show="scope.row.status == 1"
            ><el-tag type="success">审核通过 </el-tag></span
          >
          <span v-show="scope.row.status == 2"
            ><el-tag type="danger">审核拒绝</el-tag>
          </span>
        </template>
      </el-table-column>
      <el-table-column prop="paths" label="描述图片" width="180">
        <template slot-scope="scope">
          <img
            width="50px"
            height="50px"
            v-for="path in scope.row.paths"
            :src="'http://cexhnf.natappfree.cc' + path"
            alt=""
          />
        </template>
      </el-table-column>
      <el-table-column prop="description" label="描述" width="180">
      </el-table-column>
      <el-table-column prop="createTime" label="提交时间"> </el-table-column>
      <el-table-column prop="approveTime" label="审核时间"> </el-table-column>
      <el-table-column fixed="right" label="操作" width="200">
        <template slot-scope="scope" v-show="scope.row.status == 0">
          <el-button
            v-show="scope.row.status == 0"
            @click="toApprove(scope.row)"
            type="primary"
            size="small"
            >通过</el-button
          >
          <el-button
            v-show="scope.row.status == 0"
            @click="toReject(scope.row)"
            type="danger"
            size="small"
            >不通过</el-button
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { processIllness, getIllnessList } from "@/api/disease";

export default {
  data() {
    return {
      searchFrom: {
        code: "",
        status: "",
        currentPage: 1,
        pageSize: 100,
      },
      options: [
        {
          value: "0",
          label: "待审核",
        },
        {
          value: "1",
          label: "审核通过",
        },
        {
          value: "2",
          label: "审核拒绝",
        },
      ],
      tableData: [],
    };
  },
  watch: {},
  mounted() {
    this.getIllnessList();
  },
  methods: {
    getIllnessList() {
      getIllnessList(this.searchFrom).then((res) => {
        console.log(res.data);
        this.tableData = res.data;
      });
    },
    toApprove(row) {
      let approve = {
        id: row.id,
        status: "1", //审核状态（1已审核2拒绝）
      };
      console.log(approve);
      processIllness(approve).then((res) => {
        if (res.code == 200) {
          this.$message({
            message: "审核通过",
            type: "success",
          });
        } else {
          this.$message({
            message: res.message,
            type: "error",
          });
        }
      });
    },
    toReject(row) {
      let reject = {
        id: String(row.id),
        status: "2", //审核状态（1已审核2拒绝）
      };
      console.log(reject);
      processIllness(reject).then((res) => {
        if (res.code == 200) {
          this.$message({
            message: "审核通过",
            type: "success",
          });
        } else {
          this.$message({
            message: res.message,
            type: "error",
          });
        }
      });
    },
    onSubmit() {
      console.log(this.searchFrom);
    },
  },
};
</script>
